<template>
    <div class="xl-table">
        <xlUntil text="用户角色" @addForm="addForm" :untilVisible="false" :queryParam="queryParam" @delBatch="delBatch" @searchKeyWord="searchKeyWord" :export-xls-data="columns" :export-xls-url="url.exportXlsUrl"></xlUntil>
        <div class="xl-table-content">
            <xlTable
                    :columns="columns"
                    :dataSource="data"
                    rowKey="id"
                    :pagination="pagination"
                    :loading="loading"
                    @change="handleTableChange"
                    bordered
                    :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}">
                >
                <template v-slot:action="scope">
                    <a @click="editForm(scope.record)">编辑</a>
                    <a-divider type="vertical"/>
                    <a-dropdown>
                        <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
                        <a-menu slot="overlay">
                            <a-menu-item @click="seeForm(scope.record)">
                                <a>查看</a>
                            </a-menu-item>
                            <a-menu-item @click="setRole(scope.record)">
                                <a>授权</a>
                            </a-menu-item>
                            <a-menu-item>
                                <a-popconfirm title="确定删除吗?" @confirm="() => delForm(scope.record.id)">
                                    <a>删除</a>
                                </a-popconfirm>
                            </a-menu-item>
                        </a-menu>
                    </a-dropdown>
                </template>
            </xlTable>
        </div>
        <xlForm ref="xlForm" @handleOk="handleOk"></xlForm>
        <seeForm ref="seeForm"></seeForm>
        <setRole ref="auth"></setRole>
    </div>
</template>

<script>

    import xlMixin from '../../../components/mixin'
    import setRole from './model/setRole'
    export default {
        name: "index",
        mixins:[xlMixin],
        data(){
            return{
                columns: [
                    {
                        title: '编号',
                        key: 'rowIndex',
                        width: '50',
                        align: "center",
                        customRender: function (t, r, index) {
                            return parseInt(index) + 1;
                        }
                    },
                    {
                        title: '角色名称',
                        align: "center",
                        dataIndex: 'systemRoleName',
                        type: 'input'
                    },
                    {
                        title: '角色描述',
                        align: "center",
                        dataIndex: 'systemRoleDescribe',
                        type: 'input'
                    },
                    {
                        title: '角色编码',
                        align: "center",
                        dataIndex: 'systemRoleCode',
                        type: 'input'
                    },
                    {
                        title: '操作',
                        dataIndex: 'action',
                        align: "center",
                        scopedSlots: {customRender: 'action'},
                    }
                ],
                url: {
                    list: "/system/api/system/role/page/list",
                    add: "/system/api/system/role/_save",
                    edit: "/system/api/system/role/_save",
                    delete: "/system/api/system/role/_remove",
                    deleteBatch: "/system/api/system/role/_remove",
                    exportXlsUrl: "/ndo/api/new/dev/org/export/team/members",
                    importExcelUrl: "/person/project/upload/cjjn"
                }
            }
        },
        components:{
            setRole
        },
        created(){
            this.formatMerge()
            this.pageOnload()
        },
        methods:{
            setRole(data){
                this.$refs.auth.setCheckValue(data.id)
                this.$refs.auth.visible = true
            }
        }
    }
</script>

<style scoped lang="less">
    .xl-table{
        .xl-table-content{
            padding: 16px;
        }
    }
</style>
